<template>
  <div class="scheduleConfig" style="height: 100%;overflow-y: scroll;">
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane v-for="item in menu" :label="item.name" :name="item.value">
      </el-tab-pane>
    </el-tabs>
    <keep-alive>
      <component :is="activeName"></component>
    </keep-alive>
  </div>
</template>
<script>
  import process from './processManagement/index'
  import node from './nodeManagement/index'
  import * as types from '@modules/config/channelConfig/webchatSchdule/mutation-types.js'
  export default {
    name: 'scheduleConfig',
    data () {
      return {
        activeName: '',
        menu: [
          {name: this.$t('config.channel.processManage'), value: 'process'},
          {name: this.$t('config.channel.nodeManage'), value: 'node'}
        ]
      }
    },
    components: {
      process,
      node
    },
    methods: {
      isMenu () {
        this.activeName = this.menu[0].value
      },
      handleClick (tab) {
        if (tab.name === 'process') {
          let random = Math.random()
          this.$store.commit(types.SET_RELOAD_PROCESS, random)
        } else if (tab.name === 'node') {
          let random = Math.random()
          this.$store.commit(types.SET_RELOAD_NODE, random)
        }
        this.activeName = tab.name
      }
    },
    beforeMount () {
      this.isMenu()
    }
  }
</script>
<style lang="stylus" scoped>

</style>
